<template>
  <div>
    <headers v-if="$slots.header">
      <slot name="header" :msg :title="title"></slot>
    </headers>

    <main>
      <slot :msg>main</slot>
    </main>

    <footer>
      ts<slot name="footer"></slot>
    </footer>
  </div>
</template>

<script lang='ts'>
export default {
  name: 'vue',
}
</script>

<script lang='ts' setup>
import { ref, h, type Ref, isRef, reactive, isReactive, readonly, isReadonly, toRef, toRefs, unref, isProxy } from 'vue';
const msg = ref('子组件的msg');
const title = ref('子组件的标题');

</script>

<style lang='scss'></style>
